在前面幾天,我們介紹到了ReactDOMclient,今天我們要介紹的就是同樣屬於reactAPI裡面的一員,ReactDOMServer!
ReactDOMServer:
ReactDOMServer的功能是可以將你的COMPONENT渲染到你的介面,通常是用在節點服務器上的
import * as ReactDOMServer from 'react-dom/server';
var ReactDOMServer = require('react-dom/server');
我們來介紹幾個範例
renderToReadableStream()ReactDOMServer.renderToReadableStream(element, options);
renderToReadableStream 將 React element傳輸到其初始 HTML。返回解析為可讀Stream的 Promise
renderToString()ReactDOMServer.renderToString(element)
功能是將html初始化,接著React 將返回一個 HTML 字符串。
renderToStaticMarkup()ReactDOMServer.renderToStaticMarkup(element)
這個方法比較類似於renderToString,但是這個方法不會創建React 內部使用的額外 DOM ,例如data-reactroot. 將 React 用作簡單的靜態頁面生成器可以節省一些字節。
參考文章
https://zh-hant.reactjs.org/docs/react-dom-server.html